<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ page import="com.lp.cfg.ProConfig" %>
<!DOCTYPE html>
<html>
<head>
	<%@ include  file="/WEB-INF/oss/base/common/variable.jsp"%>
    <%@ include  file="/WEB-INF/oss/base/common/resource_lib.jsp"%>
    <%@ include  file="/WEB-INF/oss/base/common/variable_js.jsp"%>
    <script type="text/javascript" src="<%=basePath%>/lib/webUploader/webuploader.min.js"></script>
</head>
<script type="text/javascript">
	
</script>
<style type="text/css">
	
	.limiter{
		cursor: pointer;
	}
	.webuploader-element-invisible{
		display: none !important;
	}
	.download{
		text-align: center;
	    text-decoration: underline;
	    color: #3499da;
	    font-size: 16px;
	    padding-top: 15px;
	    cursor: pointer;
	}
</style>
<body>
	<div class="app-container">
		<div class="search-condition" type-option="search_table" config-option=" 'submit':'#searchbtns',
															'table':'#init-table',
															'wait_flag':true">
				<input type-name="device_code" style="width: 240px;" placeholder="Device SN query"  class="input input-auto" />
				<button id="searchbtns" class="button ml-20 bg-sub"><span class="icon-search"></span> inquire</button>
				
				<div class="float-right">
					<button onclick="window.open('<%=basePath%>/file/excel/设备导入模板.xls')" class="button ml-20 bg-sub "><span class="icon-download"></span> Template download</button>
					
					<div class="upload_img mr10" id="upload_file"  style="display: inline-block;position: relative;width: 170px;">
			        	<button class="button ml-20 bg-sub"><span class="icon-cloud-upload"></span> Template import</button>
					</div> 				
				</div>
		</div>
		
		 <div style="margin-top:10px;">
			<div id="init-table" type-option="table"  config-option="url:'/admin/unused/nodes',
						param:{ },
						columns:[
							{'name':'Serial number','type':'seq','value':'seq','width':'8%'}, 
							{'name':'Device name','value':'name','width':'13%'}, 
							{'name':'Device SN','value':'device_code','width':'13%'}, 
							{'name':'Communication type',type:'category','value':'iot_node_type','width':'15%'},
							{'name':'Added time','type':'time','value':'atime','width':'12%'},
							{'name':'QR code','type':'self','value_callback':'qrcodeback','width':'15%'},
							{'name':'Controls','type':'self','value_callback':'value_function','width':'10%'}]" >
			</div>
		</div>  
	</div>
	
	<div class="hide" id="InfoImg" >
		<p onclick="downImg()"  class="download">Download QR code</p>
		<div style="text-align: center;padding-bottom: 20px;">
			<img id="imgInfo" >
		</div>
	</div>
	
	<script type="text/javascript">
		function value_function(data,seq){
			return  "<button onclick='t_delete(this,"+data.id+")' class='button button-small border-red'>Delete</button> ";
		}	
	
		// 查看
		function t_look(obj){
			$("#imgInfo").attr("src", $(obj).attr("src") );
			$("#imgInfo").attr("tag", $(obj).attr("tag") );
			openWindow("Device QR code","#InfoImg","350px");
		}
		
		function downImg(){
			var img = document.getElementById('imgInfo'); 
			var url = img.src;                            
			var a = document.createElement('a');          
			var event = new MouseEvent('click');          
			a.download = "SN:" + $("#imgInfo").attr("tag") ;                  	 
			a.href = url;                               
			a.dispatchEvent(event)                        
		}
		
		function qrcodeback(data,seq){
			return "<img style='height:45px;' tag='"+ data.device_code + "' onclick='t_look(this)'  src=" + imgUrl+"/device/"+ (parseInt( data.id/100) + 1)*100  + "/"+ data.id+".jpg"+ "" + ">";  
		}
		
		// 删除
		function t_delete(obj,id){
			lcomfirm('Are you sure to delete the device?',function(){
				commonAjax("DELETE",localUrl+"/node?id="+id, "",function(){
					tip("Successfully deleted");
					setTimeout(function(){
						closeAll();
						$("#init-table").tableAdaptor();
					},1000)
				});
			});
		}
		
		$(function(){
		
			//上传模板
			UploadInit( localUrl + '/node/upload.json' , {} ,function(file,data){
				if(isOK(data)){
					tip("Import successfully");
					$("#init-table").tableAdaptor();
				}else{
					tip(data.statusMsg,2300);
				}
			}, "upload_file" ,"","100px", "35px") ; 
			
		})
	</script>
</body>
</html>